<template>
	<li class="cjy-page-body-commodity-li">
		<div>
			<div class="cjy-page-bod-commodity-box" @click='jumpEvent()'>
				<img class="nineseemoreurl" v-lazy="moreseedata.publicityPicture" />
				<span class="nineseemore">查看更多</span>
			</div>
		</div>
	</li>
</template>
<script>
	import UpdateCart from '@/components/UpdateCart';
	import lazyLoad from 'vue-lazyload';
	import ButtonChangeCart from '@/components/ButtonChangeCart/icon';
	import minxinAuto from '../mixinAuto.vue';
	import { NAVIGATE } from "../../../config/postMessage-types";
	import handlePathSpecial from "../../../utils/lxn/handlePathSpecial"
	import {mapGetters} from "vuex";
	export default {
		props: {
			moreseedata: {
				type: Object,
				default: () => {}
			}
		},
		data() {
			return {
				buttonType: 2
			}
		},
		methods: {
			jumpEvent() {
				if(!this.moreseedata.extendField) return;
				if( !this.isApp) {
					// var urldata = JSON.parse(this.moreseedata.extendField).url.path
					var urldata = handlePathSpecial(this.moreseedata.extendField)
					if(urldata) {
						this.$router.push({
							path : urldata
							// name: "MiddleWare",
							// params: {
							// 	pageName: urldata
							// }
						})
					}
				} else if (this.isApp){
					var urldata = JSON.parse(this.moreseedata.extendField).url
					if(!urldata){return}
					if(urldata.valueArray[0] == '商品详情页面' ) {
						this.gotornpage('Detail', urldata.path.split("=")[1])
					} else if(urldata.valueArray[0] == '分类页面'){
						this.gotornpage('GoodsClassify', urldata.path.split("=")[1])
					}else if(urldata.valueArray[0] == '其他页面') {
						if(urldata.path == 'IntegralBuy') {
							if(this.hasUserInfo ===0) {
								this.gotornpage('Login')
							}else{
								this.gotornpage(urldata.path)
							}
						}else if(urldata.path == 'Coupons'){
							this.gotornpage('CouponsAcquire')
						} else if (urldata.path == 'buyGiftCard') {
							if(this.hasUserInfo ===0) {
								this.gotornpage('Login')
							} else{
								this.gotornpage('BuyGiftCard')
							}
						} else if(urldata.path == 'foodChecked'){
							if(this.hasUserInfo ===0) {
								this.gotornpage('Login')
							}
							else{
								this.gotornpage('FoodCheck')
							}
						} else if(urldata.path == 'prize_card'){
								if(this.hasUserInfo ===0) {
									this.gotornpage('Login')
								} else {
								this.$router.push({
									name: "MiddleWare",
									params: {
										pageName: urldata.path
									}
								})
							}
						} else if(urldata.path == 'integral'){
							console.log("urldata.path",urldata.path)
								if(this.hasUserInfo ===0) {
									this.gotornpage('Login')
								} else {
								this.$router.push({
									name: "MiddleWare",
									params: {
										pageName: urldata.path
									}
								})
							}
						} else if(urldata.path == 'login'){
							this.gotornpage('Login')
						} else if(urldata.path == 'register'){
							this.gotornpage('Regrester')
						} else {
							this.$router.push({
								name: "MiddleWare",
								params: {
									pageName: urldata.path
								}
							})
						}
					}
				}
			},
			gotornpage(page, code) {
				let params = {}
				if(page=='Detail'){
					params = {
						screen: page,
						params:{
							goodsCode: code
						}
					}
				}else if(page=='GoodsClassify'){
					params = {
						screen: page,
						params:{
							classCode: code
						}
					}
				} else {
					params = {
						screen: page,
					}
				}
				let goBackIns = {
					type: NAVIGATE,
					params: params
				}
				window.postMessage(JSON.stringify(goBackIns));
			}
		},
		mounted() {

		},
		computed: {
			isApp() {
				return window.isApp;
			},
			...mapGetters('wxh', [
                'userInfo'
            ]),
            hasUserInfo() {
                return Object.keys(this.userInfo).length;
            }
		},
		mixins: [minxinAuto],
		components: {
			UpdateCart,
			ButtonChangeCart
		},
	}
</script>

<style scoped>
	.cjy-page-body-commodity-li {
		position: relative;
		float: left;
		width: 33.3%;
		height: 0;
		padding-bottom: 58%;
		margin-bottom: 0.5rem;
	}
	
	.cjy-page-body-commodity-li>div {
		position: absolute;
		width: 100%;
		height: 100%;
		padding: 0 0.1rem;
	}
	
	.cjy-page-bod-commodity-box {
		width: 100%;
		height: 100%;
		background: white;
		position: relative;
		border-radius: 1px;
		overflow: hidden;
		border-radius: 4px;
	}
	
	.cjy-page-image-box {
		width: 100%;
		height: 0;
		position: relative;
		padding-bottom: 90%;
		overflow: hidden;
	}
	
	.cjy-page-title-box,
	.cjy-page-lable-box,
	.cjy-page-price-box,
	.cjy-page-subtitle-box {
		padding: 0 0.3rem;
		text-align: left;
		text-overflow: ellipsis;
		overflow: hidden;
		word-break: break-all;
		white-space: nowrap;
	}
	
	.cjy-page-title-box {
		color: #444;
		line-height: 0.8rem;
		height: 1.6rem;
		font-weight: 600;
		font-size: 0.65rem;
		word-break: break-all;
		white-space: pre-wrap;
	}
	
	.cjy-page-subtitle-box {
		color: #444;
		line-height: 0.8rem;
		font-weight: 600;
		font-size: 0.65rem
	}
	
	.cjy-page-lable-box {
		font-size: 0.6rem;
		width: 100%;
		color: #FB4F5C;
		text-line-height: 0.9rem;
		display: inline-block;
	}
	
	.cjy-page-lable-box>.cjy-lable {
		display: inline-block;
		border-radius: 0.3rem;
		border: 1px solid #FB4F5C;
		font-size: 0.4rem;
		color: #FB4F5C;
		padding: 0px 0.2rem;
	}
	
	.cjy-page-price-box {
		position: absolute;
		bottom: 0;
		width: 100%;
		font-size: 0.65rem;
		/*margin-bottom: 0.1rem;*/
		color: rgb(246, 86, 86);
	}
	
	.cjy-page-price-box>.cjy-price {
		font-size: 0.8rem;
		font-weight: 400;
		display: inline-block;
		line-height: 0.8rem;
	}
	
	.cjy-page-price-box>.cjy-price-unit {
		color: black;
	}
	
	.cjy-add-cart-button-box {
		height: 2rem;
		width: 2rem;
		padding: 0.5rem;
		position: absolute;
		z-index: 1;
		right: 0;
		bottom: 0;
	}
	
	.nineseemoreurl {
		width: 100%;
		height: 100%;
	}
	
	.nineseemore {
		display: inline-block;
		font-size: 1rem;
		color: #fff;
		position: absolute;
		top: 40%;
		width: 100%;
		left: 0;
	}
</style>